<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@taglib prefix="form" uri="http://www.springframework.org/tags/form" %>
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>商品发布</title>
    <!-- layUI的核心CSS文件 -->
    <link rel="stylesheet" type="text/css"
          href="${pageContext.request.contextPath}/static/layui-v2.5.7/layui/css/layui.css"/>
    <!-- layUI的核心JS文件 -->
    <script src="${pageContext.request.contextPath}/static/layui-v2.5.7/layui/layui.js" type="text/javascript"
            charset="UTF-8"></script>
    <script src="${pageContext.request.contextPath}/static/js/jQuery.js" charset="UTF-8"></script>
    <style type="text/css">
        .layui-table-cell {
            height: 50px;
            line-height: 36px;
        }
    </style>
</head>
<body>
<script>
    //JavaScript代码区域
    layui.use('element', function () {
        var element = layui.element;
    });
    layui.use('form', function () {
        var form = layui.form;
    });
</script>
<!-- 头部导航栏 -->
<div class="layui-layout layui-layout-admin">
    <div class="layui-header">
        <div class="layui-logo"><a style="color: #009688;">龙洞闲置购物系统</a></div>

        <!-- 头部区域（可配合layui已有的水平导航） -->

        <ul class="layui-nav layui-layout-left">
            <li class="layui-nav-item">
                <a href="ShowALLGoods">首页</a>
            </li>
            <li class="layui-nav-item">
                商品发布
            </li>
        </ul>
        <%@include file="../common/head.jsp"%>
    </div>
</div>

<div class="layui-row" style="margin-bottom: 50px;margin-top: 50px;">
    <div class="layui-col-md6 layui-col-lg-offset3" style="border: 1px solid black; padding: 20px;">

        <form id="addForm" class="layui-form layui-form-pane" action="addGoods" enctype="multipart/form-data" method="post">

            <fieldset class="layui-elem-field layui-field-title" style="margin-top: 25px">
                <!-- 种类名称 -->
                <legend style="margin-left: 50px;">商品发布</legend>
            </fieldset>
<%--          默认传送商品数量为1  --%>
            <input id="number" type="hidden" name="gnumber" value="1">
<%--            向服务器传送发布商品的用户id--%>
            <input id="uid" type="hidden" name="guid" value="${user.uid}">
<%--            向服务器发送用户名字--%>
            <input id="uname" type="hidden" name="guname" value="${user.uname}">

            <input id="img_path" type="hidden" name="gimg_path" value="${goods.gimg_path}">

            <input id="tinyint" type="hidden" name="gtinyint" value="1">

            <div class="layui-col-lg-offset1 layui-col-md10" style="margin-top:10px;">
                <label class="layui-form-label">图片</label>
                <input id="imgfile" type="file" name="gimgfile">
            </div>

            <div class="layui-col-lg-offset1 layui-col-md10" style="margin-top:10px;">
                <label class="layui-form-label">商品名</label>
                <div class="layui-input-block">
                    <input id="name" type="text" name="gname" required lay-verify="required" autocomplete="off"
                           class="layui-input"
                    >
                </div>
            </div>

            <div class="layui-col-lg-offset1 layui-col-md10 " style="margin-top:10px;">
                <label class="layui-form-label">价格</label>
                <div class="layui-input-block">
                    <input id="price" type="text" name="gprice" required lay-verify="required" autocomplete="off"
                           class="layui-input" oninput = "value=value.replace(/[^\d]/g,'')">
                </div>
            </div>
            <div class="layui-col-lg-offset1 layui-col-md10" style="margin-top:10px;">
                <label class="layui-form-label">类别</label>
                <div class="layui-input-block">
                    <select id="cid" name="gcid" lay-verify="required" required>
                        <c:forEach items="${categories}" var="category">
                            <option value=${category.cname}>${category.cname}</option>
                        </c:forEach>
                    </select>
                </div>
            </div>

            <div class="layui-col-lg-offset1 layui-col-md10" style="margin-top:10px;">
                <div class="layui-form-item layui-form-text">
                    <label class="layui-form-label">商品描述</label>
                    <div class="layui-input-block">
                        <textarea id="detail" name="gdetail" placeholder="请输入描述，不多于40字" class="layui-textarea"
                                  maxlength="40" style="resize: none"></textarea>
                    </div>
                </div>
            </div>

            <div class="layui-col-lg-offset3 layui-col-md10" style="margin-top:30px;">
                <div class="layui-input-block">
                    <button class="layui-btn" lay-submit lay-filter="save">确认发布</button>
                </div>
            </div>
            <script>
                let goods = document.getElementById('seleteGoods');
                let needs = document.getElementById('seleteNeeds');
                let addForm = document.getElementById('addForm');
                //-------如果商品和需求的name都一样，就不需要再用以下代码修改name了-------------
                let number = document.getElementById('number');
                let uid = document.getElementById('uid');
                let uname = document.getElementById('uname');
                let img_path = document.getElementById('img_path');
                let tinyint = document.getElementById('tinyint');
                let imgfile = document.getElementById('imgfile');
                let name = document.getElementById('name');
                let price = document.getElementById('price');
                let cid = document.getElementById('cid');
                let detail = document.getElementById('detail');
                //------------------------------------

                //点击商品按钮后
                goods.onclick = function () {
                    addForm.action="addGoods";
                    number.name = "gnumber";
                    uid.name = "guid";
                    uname.name = "guname";
                    img_path.name = "gimg_path";
                    tinyint.name = "gtinyint";
                    name.name = "gname";
                    price.name = "gprice";
                    cid.name = "gcid";
                    detail.name = "gdetail";
                    goods.classList.remove("layui-btn-primary");
                    needs.classList.add("layui-btn-primary");
                }

                //点击需求按钮后，修改成对应需求的名字和action即可
                needs.onclick = function () {
                    addForm.action="addGoods";
                    number.name = "gnumber";
                    uid.name = "guid";
                    uname.name = "guname";
                    img_path.name = "gimg_path";
                    tinyint.name = "gtinyint";
                    name.name = "gname";
                    price.name = "gprice";
                    cid.name = "gcid";
                    detail.name = "gdetail";
                    needs.classList.remove("layui-btn-primary");
                    goods.classList.add("layui-btn-primary");
                }
            </script>

        </form>


    </div>
</div>
</body>
</html>
